﻿
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=8">
		<title></title>
		<link href="../themes/kingmenu/css/index.css" rel="stylesheet" type="text/css" />

        <link href="../themes/kingmenu/css/bootstrap.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="../themes/kingmenu/js/bootstrap.js" ></script>

        <style>
            #xs-logo {
                width: 220px;
                height: 39px;
                float: left;
                cursor: pointer;
                margin: 12px 15%;
            }
            .xs-main {
                height: auto;
                margin: 20px 0;
                background: none;
            }
            .xs-mainInput2 input{
                width: 190px !important;
                height: auto !important;
                padding: 11px 0 !important;
            }
            .xs-mainLogo {
                width: 100%;
                height: 350px;
                background-color: #FFFFFF;
                border-radius: 4px;
                margin: 10px 0;
            }
            .xs-mainLogo button {
                height: 46px;
                line-height: 46px;
                border-radius: 4px;
                text-align: center;
                cursor: pointer;
                outline: none;
            }
            #xs-phone {
                margin: 0;
                float: left;
                width: 40px;
                height: 35px;
                margin-top: 8px;
            }
            #xs-consult {
                margin: 0;
                float: left;
                width: 40px;
                height: 35px;
            }
            #xs-public {
                margin: 0;
                float: left;
                width: 40px;
                height: 35px;
            }
            .xs-footer p {
                margin: 0;
            }
             .xs-footerConten{
                height: auto;
            }
            /*.xs-phone, .xs-consult, .xs-public{
                margin: 0;
            }*/
            .xs-phone {
                margin-bottom: 5px;
            }
                .xs-phone p {
                    float: left;
                    margin-left: 15px;
                    font-size: 18px;
                    color: #E23333;
                    margin-top: 8px;
                }
            .xs-consult button{
                width: 60px;
                height: 25px;
            }
            .xs-present {
                margin-top: 5px;
                color: #7A7A7A;
                font-size: 12px;
            }
            #xs-img_Phone{
                width: 22px;
	            height: 22px;
	            margin: 9px 6px 9px 7px;
	            float: left;
            }
            .dibudi {
                width: 100%;
                height: 50px;
                font-size: 14px;
                color: #fff;
                text-align: center;
                line-height: 50px;
                background-color: #3a3c48;
                position: absolute;
                bottom: 0;
            }
            .dibudi a {
                color: #fff;
            }
        </style>
	</head>
	<body>
		<div class="logo hidden-xs">
			<div class="conten">
				<div class="conHead">
					<img id="logo" src="@ViewBag.logo" />
					<div class="down">
						<img id="down" src="../themes/kingmenu/img/down.png" />
                        <p><a href="../downloadpage/download.html" style="color:#007ACC;font-size:13pt;"  target="_blank">收银端免费下载</a></p>
					</div>
				</div>
				
				<div class="main">
					<div class="mainConten">
						<div class="mainLeft">
							<img id="textImg" src="@ViewBag.solution" />
							<div class="leftText">
                                <button>详情了解</button>
								<img id="mainIcon" src="../themes/kingmenu/img/pic.png" />
							</div>
							<img id="max" src="../themes/kingmenu/img/people.png" />
						</div>

						<div class="mainRight">
                            <form role="form" id="form1" action="@Url.Action("Login")" method="post">
							<div class="mainLogo">
                                <div class="mainH1">
								    <p class="mainH3">用户登录</p>
                                </div>
                                <div class="mainInput2">
                                    <div class="mainPhone">
									    <img id="img_Phone" src="../themes/kingmenu/img/icn-phone.png"/>
                                        <input id="Phone" name="Phone" type="text" value="" 
                                            placeholder='用户名称' onfocus="this.placeholder=''" 
                                            onblur="this.placeholder='用户名称'" >
								    </div>                               
                                    <div class="mainPassword">
									    <img id="img_Password2" src="../themes/kingmenu/img/icn-lock.png"/>
                                        <input id="Password2" name="Password2" type="password" autocomplete="off" value="" 
                                            placeholder='输入密码' 
                                            onfocus="this.placeholder=''" onblur="this.placeholder='请输入密码'" >
								    </div>
                                </div>
                                <div class="mainBox">
                                 <a href="#" class="link-right" onclick="forgotPassword()">忘记密码了</a>
                                    <div class="field identify" style="color: red;">

                                    </div>
                                </div>
                                <button id="land" type="button" style="font-size:13pt;" value="登陆">登陆</button>		                                
                                <div class="user-register" style="float:right;">没有帐号？ <a href="/Home/Registe" class="register">立即注册</a></div>                                
                                <div class="copy-info" style="font-size:12pt;"><a href="#" onclick="Auto()">演示帐号</a></div>
							</div>
                                <input type="hidden" id="loginType" name="loginType" value="1" />
                                <input type="hidden" name="error" id="error" value="@ViewBag.error" />
                                <input type="hidden" id="ver" value="@ViewBag.softVersion" />	
                            </form>
						</div>
					</div>
				</div>

				<div class="footer">
					<div class="footerConten">
						<div class="phone">
							<img id="phone" src="../themes/kingmenu/img/phone.png"/>
							<p class="phoneP">@ViewBag.phone</p>
							<p class="phoneP pp">@ViewBag.phonePP</p>
						</div>
						<div class="consult">
							<img id="consult" src="../themes/kingmenu/img/wx.png"/>
                            <button >立即咨询</button>
						</div>
						<div class="public">
							<img id="public" src="../themes/kingmenu/img/erweima.png"/>
                            <p>@ViewBag.corpname</p>
						</div>
					</div>					
                    <p class="present"></p>
				</div>
                <div class="dibudi">
                    Copyright  2014-2020 @ViewBag.present  
                    <a href="https://beian.miit.gov.cn" target="_blank">粤ICP备15002429号</a>
                </div>
			</div>			
		</div>

        @* 手机端 *@
        <div class="logo visible-xs">
			<div class="conten">
				@*<div class="conHead">*@
					<img id="xs-logo" src="@ViewBag.logo" />
				@*</div>*@
				
				<div class="main xs-main">
                    <div class="container">
                        <div class="row">
                            <div class="mainConten col-xs-12">
                                <div class="mainRight col-xs-12" style="padding: 0;">
                                    <form role="form" id="form2" action="@Url.Action("Login")" method="post">
                                        <div class="xs-mainLogo">
                                            <div class="mainH1">
								                <p class="mainH3">用户登录</p>
                                            </div>
                                            <div class="mainInput3 xs-mainInput2">
                                                <div class="mainPhone">
									                <img id="xs-img_Phone" src="../themes/kingmenu/img/icn-phone.png"/>
                                                    <input id="xs-Phone" name="Phone" type="text" value="" 
                                                        placeholder='用户名称' onfocus="this.placeholder=''" 
                                                        onblur="this.placeholder='用户名称'" >
								                </div>                           
                                                <div class="mainPassword">
									                <img id="xs-img_Password2" src="../themes/kingmenu/img/icn-lock.png"/>
                                                    <input id="xs-Password2" name="Password2" type="password" autocomplete="off" value="" 
                                                        placeholder='输入密码' 
                                                        onfocus="this.placeholder=''" onblur="this.placeholder='请输入密码'" >
								                </div>
                                            </div>
                                            <div class="mainBox">
                                             <a href="#" class="link-right" onclick="forgotPassword()">忘记密码了</a>
                                                <div class="field identify" style="color: red;">

                                                </div>
                                            </div>
                                            <button id="xs-land" type="button" style="font-size:13pt;" value="登陆">登陆</button>		                                
                                            <div class="user-register" style="float:right;">没有帐号？ <a href="/Home/Registe" class="register">立即注册</a></div>                                
                                            <div class="copy-info" style="font-size:12pt;"><a href="#" onclick="Auto()">演示帐号</a></div>
                                        </div>
                                         <input type="hidden" id="xs-loginType" name="loginType" value="1" />
                                         <input type="hidden" name="error" id="xs-error" value="@ViewBag.error" />
                                         <input type="hidden" id="xs-ver" value="@ViewBag.softVersion" />
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>							
				</div>

				<div class="footer xs-footer">
                    <div class="container">
                        <div class="row">
                            <div class="xs-footerConten col-xs-12">

                                <div class="phone xs-phone col-xs-10 col-xs-offset-1">
							        <img id="xs-phone" src="../themes/kingmenu/img/phone.png"/>
							        <p class="">@ViewBag.phone</p>
							        <p class=" pp">@ViewBag.phonePP</p>
						        </div>				        
					        </div>					
                            <p class="xs-present col-xs-12">@ViewBag.present</p>
                        </div>
                    </div>
					
				</div>
			</div>			
		</div>

@*<script type="text/javascript" src="../js/jquery.cookie.js"></script>*@       
<script type="text/javascript">

    window.onload = function () {
        //IE7以下浏览器的判断
        var DEFAULT_VERSION = 8.0;
        var ua = navigator.userAgent.toLowerCase();
        var isIE = ua.indexOf("msie") > -1;
        var safariVersion;
        if (isIE) {
            safariVersion = ua.match(/msie ([\d.]+)/)[1];
        }
        if (safariVersion < DEFAULT_VERSION) {
            //alert('系统检测到您正在使用ie8以下内核的浏览器，不能实现完美体验，请更换或升级浏览器访问！')
            mini.confirm("您当前的浏览器版本,可能会影响使用体验,建议使用谷歌浏览器！", "确定？",
                function (action) {
                    if (action == "ok") {
                        window.location.href = "/downloadpage/download.html";
                    }
                }
            );
        };
        $('#Phone').blur(function () {
            var phone = $('#Phone').val()
            localStorage.setItem('Phone', phone);
            console.log($('#Phone').val());
        });

        pl();
    }

    function setCookie(c_name, value, expiredays) {
        var exdate = new Date();
        exdate.setDate(exdate.getDate() + expiredays)
        document.cookie = c_name + "=" + escape(value) +
        ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString());
    }

    $(function () {
        $("#land").click(function () {
            //console.log(num);
            if ($('#Phone').val() == '') {
                localStorage.removeItem('Phone');
            }
            ck = "submit";
            submitForm();
        });
        $("#land").keyup(function () {
            if (event.keyCode == 13) {
                ck = "submit";
                submitForm();
            }
        });
        $("#register").click(function () {
            ck = '';
            window.location.href = "Registe";
        });


        $('.mainBox a').on('click', function () {
            location.href = "/User/RetrievePassword";
        })

        //console.log($('.mainHRight'));
        var num = 0;

        if ($("#error").val() != "") {
            $(".identify").css("display", "block");
            $(".identify").html($("#error").val());
            var phone = localStorage.getItem('Phone');
            $('#Phone').val(phone);
            if ($('#Phone').val() != '') {
                setTimeout(function () {
                    $('#Password2').focus();
                }, 50);
            }
            //mini.alert($("#error").val());
        }
        focusNextInput(1);

        //手机端
        $("#xs-land").click(function () {
            //console.log(num);
            if ($('#xs-Phone').val() == '') {
                localStorage.removeItem('Phone');
            }
            ck = "submit";
            submitForm();
        });
        $("#xs-land").keyup(function () {
            if (event.keyCode == 13) {
                ck = "submit";
                submitForm();
            }
        });

        if ($("#xs-error").val() != "") {
            $(".identify").css("display", "block");
            $(".identify").html($("#xs-error").val());
            var phone = localStorage.getItem('Phone');
            $('#xs-Phone').val(phone);
            if ($('#xs-Phone').val() != '') {
                setTimeout(function () {
                    $('#xs-Password2').focus();
                }, 50);
            }
            //mini.alert($("#error").val());
        }
    });
    var width = window.innerWidth;//手机端的宽度 768
    console.log(width)
    function submitForm() {
        if (width < 768) {
            if (ck == "submit") {
                $("#form2").submit();
                ck = "";
            }
        } else {
            if (ck == "submit") {
                $("#form1").submit();
                ck = "";
            }
        }
        return false;
    }


    function pl() {
        if (!('placeholder' in document.createElement('input'))) {

            $('input[placeholder],textarea[placeholder]').each(function () {
                var that = $(this),
                        text = that.attr('placeholder');
                if (that.val() === "") {
                    that.val(text).addClass('placeholder');
                }
                that.focus(function () {
                    if (that.val() === text) {
                        that.val("").removeClass('placeholder');
                    }
                })
                        .blur(function () {
                            if (that.val() === "") {
                                that.val(text).addClass('placeholder');
                            }
                        })
                        .closest('form').submit(function () {
                            if (that.val() === text) {
                                that.val('');
                            }
                        });
            });
        }
    }

    function focusNextInput(num) {
        //console.log(num);
        //var Div = document.getElementById('form1');
        //var inputs = Div.getElementsByTagName("input");
        var inputs1 = $('.mainInput1').find('input');
        var inputs2 = $('.mainInput2').find('input');
        var inputs3 = $('.mainInput3').find('input');
        //console.log(inputs2.length);
        if (num == 0) {
            traverse(inputs1, num);
        } else {
            if (width < 768) {
                traverse(inputs3, num);
            } else {
                traverse(inputs2, num);
            }

        }


    }

    function Auto() {
        $('#Phone').val('8888');
        $('#Password2').val('888888');
        ck = 'submit'; submitForm();
    }

    function traverse(inputs, num) {
        for (var i = 0; i < inputs.length; i++) {
            inputs[i].index = i;
            inputs[i].onkeyup = function (event) {
                if (event.keyCode == 13) {
                    // 如果是最后一个，则焦点回到第一个
                    //console.log(this.index);
                    if (this.index == (inputs.length - 1)) {
                        if (width < 768) {
                            if (!$("#xs-Phone").val() || !$("#xs-Password2").val()) {
                                mini.alert('用户名或密码不能为空');
                                inputs[0].focus();
                            } else {
                                ck = "submit";
                                submitForm();
                                inputs[0].select();
                            }
                        } else {
                            if (!$("#Phone").val() || !$("#Password2").val()) {
                                mini.alert('用户名或密码不能为空');
                                inputs[0].focus();
                            } else {
                                ck = "submit";
                                submitForm();
                                inputs[0].select();
                            }
                        }

                    } else {
                        inputs[this.index + 1].select();
                        //inputs[this.index].blur();
                        //console.log(this.index+1);
                    }
                }
            }
        }
    }
</script>
</body>
</html>

